<template>
  <el-row v-loading="loading">

    <el-col :span="24">
      <interpose-classify-edit ref="interposeClassifyEdit" v-on:save-finished="getInterposeList()"></interpose-classify-edit>
      <el-row class="search-row">
        <el-col :span="12">
            <el-input placeholder="请输入会员名称" v-model="search.name">
            <el-button slot="append" icon="el-icon-search" @click="getInterposeList()"></el-button>
          </el-input>
        </el-col>
        <el-col :span="12" style="text-align: right;">
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-table :data="InterposeList" border  header-cell-class-name="header-row">
            <el-table-column prop="tMember.filenumber" label="档案号" header-align="center" width="120"></el-table-column>
            <el-table-column prop="tMember.name" label="姓名" header-align="center" width="120"></el-table-column>
            <el-table-column prop="tMember.sex" label="性别" header-align="center">
              <template slot-scope="scope">
                <span v-if="scope.row.tMember.sex==1">男</span>
                <span v-else>女</span>
              </template>
              </el-table-column>
            <el-table-column prop="tMember.age" label="年龄" header-align="center"></el-table-column>
            <el-table-column prop="status" label="状态" header-align="center">
              <template slot-scope="scope">
                <span v-if="scope.row.status == 0">未分类</span>
                <span v-else>已分类</span>
              </template>
            </el-table-column>
            <el-table-column prop="peopleClassify" label="人群分类" header-align="center"></el-table-column>
            <el-table-column prop="tHealthmgr.healthMgrName" label="健康管理师" header-align="center"></el-table-column>

            <el-table-column label="操作" header-align="center" align="center" width="150">
              <template slot-scope="scope">
                <el-button v-show="permission.edit" type="text" v-if="scope.row.status==0"
                           @click="handleEditInterpose(scope.$index, scope.row)">确认分类</el-button>
                <el-button v-show="permission.edit" type="text" v-if="scope.row.status==1||scope.row.status==2"
                           @click="handleEditInterpose(scope.$index, scope.row)">查看</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-pagination
            background
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="search.currentPage"
            :page-sizes="[5, 10, 20]"
            :page-size="5"
            layout="total, sizes, prev, pager, next, jumper"
            :total="InterposeTotal">
          </el-pagination>
        </el-col>
      </el-row>
    </el-col>
  </el-row>
</template>

<script>
<<<<<<< HEAD
  import {listInterpose} from '@/api/xy/interpose'
    import { listResourcePermission } from "@/api/resource"
=======
  import {listInterposes,getInterposeTypeById} from '@/api/junM/interposeClassify'
  import InterposeClassifyEdit from '../../components/interposeClassify/interposeClassifyEdit.vue'
>>>>>>> origin/master

  export default {
    data() {
      return {
        loading: false,
        permission: {
          // add: true,
          edit: true,
          // remove: true
        },
        search: {
          name: '',
          offset: 0,
          limit: 5,
          currentPage:1
        },
        InterposeTotal: 0,
        InterposeList: []
      }
    },
    methods: {
      getInterposeList() {
        this.loading = true
        listInterposes(this.search)
          .then(response => {
            this.InterposeTotal = response.data.total
            this.InterposeList = response.data.rows
            this.loading = false
          })
          .catch(error => {
            console.log(error)
            this.loading = false
          })
      },
      handleSizeChange(val) {
        this.search.limit = val;
        this.search.offset = (this.search.currentPage - 1) * val
        this.getInterposeList()
      },
      handleCurrentChange(val) {
        this.search.offset = (val - 1) * this.search.limit
        this.search.currentPage = val
        this.getInterposeList()
      },
      async pageInit() {
        this.loading = true
        try {
<<<<<<< HEAD
          let [listInterposeResp, listPermissionResp] = await Promise.all([
            listInterpose(this.search),
             listResourcePermission(this.$route.meta.routerId)
          ])
          this.InterposeTotal = listInterposeResp.data.total
          this.InterposeList = listInterposeResp.data.rows


        //   this.permission.add = listPermissionResp.data.find(item => {
        //   return item.resourcePermission == "checks:add"
        // })
        // this.permission.edit = listPermissionResp.data.find(item => {
        //   return item.resourcePermission == "checks:update"
        // })
          console.log(this.InterposeList);
=======
          let [listInterposeResp] = await Promise.all([
            listInterposes(this.search),
          ])
          this.InterposeTotal = listInterposeResp.data.total
          this.InterposeList = listInterposeResp.data.rows
          // console.log(this.InterposeList);
>>>>>>> origin/master
          this.loading = false
        } catch(error) {
          this.outputError(error)
        }
      },
      handleEditInterpose(index, row) {
        this.loading = true
        getInterposeTypeById(row.id)
          .then(response => {
            this.$store.commit('SET_HEALTH_MGR_NAME',row.tHealthmgr.healthMgrName)
            this.$store.commit('SET_STATU',row.status)
            this.$refs.interposeClassifyEdit.$emit('openEditRoleDialog', response.data)
            this.getInterposeList()
            this.loading = false
          })
          .catch(error => {
            this.outputError(error)
          })
          this.$emit("save-finished")
      },
      outputError(error) {
        console.log(error.response ? error.response : error.message)
        this.loading = false
        this.$message({
          showClose: true,
          message: '出错了，请按F12查看浏览器日志。',
          type: 'error'
        })
      }
    },
    components: { InterposeClassifyEdit },
    created() {
      this.pageInit()
    }
  }
</script>

<style lang="scss" scoped>
  .search-row {
    padding-bottom: 8px;
    .el-input {
      width: 260px;
    }
  }

  .role-locked {
    color: red;
  }
  .role-not-locked {
    color: green;
  }
</style>
